//作者简介
import React, { useState, useEffect } from "react";
import { Avatar, Divider, Tooltip, Tag } from "antd";
import Link from 'next/link'
import "../static/style/components/author.css";
import servicePath from "../config/apiUrl";
import axios from "axios";
import CountUp from "react-countup";

const LeftTag = () => {
  const [all_part_count, setAll_part_count] = useState(0);
  const [all_view_count, setAll_view_count] = useState(0);
  const [typelists, setTylelists] = useState([]);
  let initTypeList = () => {
    axios({
      method: "post",
      url: servicePath.findArticleTypeList,
    }).then((res) => {
      //   setList(res.data.list);
      let list = res.data.data;
      let tarray = [];
      let darray = [];
      list.map((item, index) => {
        if (tarray.indexOf(item.typeName) == -1 && item.typeName) {
          tarray.push(item.typeName);
          darray.push({
            type: item.typeName,
            count: 0,
            typeId: item.articleId,
          });
        }
        return darray;
      });
      list.forEach((item) => {
        darray.forEach((initem) => {
          if (item.typeName == initem.type) {
            initem.count = initem.count + 1;
          }
        });
      });
      setTylelists(darray);
      // console.log(darray)
    });
  };

  let entryInfo = (data) => {};
  useEffect(() => {
    // fetchData();
    initTypeList();
  }, []);
  let colorList = ["magenta", "green", "geekblue"];
  return (
    <div className="author-div comm-box">
      <div className="author-tag">
        {typelists.map((item, index) => {
          return (
            <Link href={{ pathname: "/list", query: { id: item.id,type:item.typeId } }}>
              <Tag
                style={{ cursor: "pointer" }}
                onClick={entryInfo.bind(this, item.typeId)}
                key={index}
                color={colorList[index % 3]}
              >
                {item.type}({item.count})
              </Tag>
            </Link>
          );
        })}
      </div>
    </div>
  );
};

export default LeftTag;
